<template>
  <div class="toolbar">
    <div class="toolbar-left">
      <button class="toolbar-btn" @click="$emit('toggle-sidebar')" title="切换侧边栏">
        <span class="icon">☰</span>
      </button>
      <button class="toolbar-btn" @click="$emit('new-file')" title="新建文件">
        <span class="icon">+</span>
      </button>
    </div>
    <div class="toolbar-title">Markdown 编辑器</div>
    <div class="toolbar-right">
      <button class="toolbar-btn" @click="$emit('open-settings')" title="设置">
        <span class="icon">⚙</span>
      </button>
      <span v-if="sidebarVisible" class="status-text">侧边栏已开启</span>
      <span v-else class="status-text">侧边栏已关闭</span>
    </div>
  </div>
</template>

<script setup>
const props = defineProps({
  sidebarVisible: {
    type: Boolean,
    default: true
  }
})

const emit = defineEmits(['toggle-sidebar', 'new-file', 'open-settings'])
</script>